<template>
  <div class="search-bar">
    <el-form :inline="true" :model="formItem" class="form-filter" size="mini">
      <el-form-item>
        <el-select v-model="formItem.s_spareTypeCode" clearable placeholder="选择备品备件类型" @change="treeSelected">
          <el-option v-for="(item) in typeOptions" :key="item.code" :label="item.title" :value="item.code" />
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-select v-model="formItem.s_storehouseId" clearable placeholder="请选择仓库" @change="storehouseChange">
          <el-option v-for="(item) in storehouse" :key="item.id" :label="item.name" :value="item.id" />
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-input
          v-model="formItem.s_globalSearch"
          placeholder="请输入SN/合同/编号"
          clearable
          @keyup.enter.native="globalSearch"
        />
      </el-form-item>      
      <el-form-item>
        <el-button plain icon="el-icon-search" @click="search" />
      </el-form-item>
    </el-form>
  </div>
</template>

<script>

import { list as goodsFileList } from '@neu/dcam-ui/api/goodsFile'
import { list as storehouseList } from '@neu/dcam-ui/api/storehouse'
import { tree } from '@neu/dcam-ui/api/spareType'

// 定义一个查询表单原始项
const formItem = {
  s_goodsFileId: '',
  s_batch: '',
  s_spareTypeCode: null,
  s_storehouseId: '',
  s_stockStartTime: '',
  s_stockEndTime: ''
}

export default {
  name: 'StockTableFilter',
  data() {
    return {
      formItem: {
        ...formItem
      },
      /** 货品信息 */
      goodsFile: [],
      /** 供应商 */
      manufacturer: [],
      /** 仓库 */
      storehouse: [],
      /** 时间选择器 */
      pickerOptions: {
        shortcuts: [{
          text: '最近一周',
          onClick(picker) {
            const end = new Date()
            const start = new Date()
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
            picker.$emit('pick', [start, end])
          }
        }, {
          text: '最近一个月',
          onClick(picker) {
            const end = new Date()
            const start = new Date()
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
            picker.$emit('pick', [start, end])
          }
        }, {
          text: '最近三个月',
          onClick(picker) {
            const end = new Date()
            const start = new Date()
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
            picker.$emit('pick', [start, end])
          }
        }]
      },
      /** 存储时间范围 */
      timeRangeStockStart: [],
      /** 资产类型树 */
      typeOptions: []
    }
  },
  mounted() {
    goodsFileList().then(response => {
      this.goodsFile = response.data
    })
    tree().then(response => {
      this.typeOptions = response.data
    })
    storehouseList().then(response => {
      this.storehouse = response.data
    })
  },
  created() {

  },
  methods: {

    // 查询按钮点击事件处理
    search: function() {
      if (this.timeRangeStockStart.length !== 0) {
        this.formItem.s_stockStartTime = this.timeRangeStockStart[0]
        this.formItem.s_stockEndTime = this.timeRangeStockStart[1]
      }
      this.$parent.filterItems = this.formItem
      this.$parent.filter(this.formItem)
    },
    // 重置按钮点击事件处理
    reset: function() {
      this.formItem = {
        ...formItem
      }
      this.timeRangeStockStart = []
      this.search()
    },
    onChange: function(val) {
      this.$parent.onResize()
    },
    goodsFileChange: function() {
      this.search()
    },
    treeSelected: function() {
      this.search()
    },
    manufacturerChange: function() {
      this.search()
    },
    storehouseChange: function() {
      this.search()
    }
  }
}
</script>
